<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<body>








<form action="" method="post" style="width: 70%;padding: 20px;border:1px solid #aaa">
<input type="hidden" name = "modelId" value="${opt.id}"/>
    <div class="box"  id="boxDiv" >
        <c:forEach items="${opt.arr}" var = "op" varStatus="vs">
            <div class="groupBox" style="border:1px solid #aaa;padding: 10px" >
                <div class="top_group row " style="border-bottom: 1px solid #aaa;padding-bottom: 10px">
                   <div class="col-sm-6" >
                       <span >组${vs.index+1}</span>
                       <input type="text" name="poll${vs.index}.parentName" placeholder="填写问题组名称" value="${op.pagename}">
                       <input type="hidden" name="poll${vs.index}.parentId" value="${op.id}"/>
                   </div>
                   <div class=" col-sm-6">
                       <button   style="height: 25px;line-height:15px;border-radius: 5px;"   class="btn btn-success" type="button" onclick="addGroups()"> 添加一组</button>

                   </div>
                </div>
            <c:forEach items="${op.select}" var = "pt" varStatus="va">
                <div class="content_group" style="margin-top: 10px">
                    <div class="row" >
                        <span >问题${va.index+1}标题</span>
                        <input  type="text" name="poll${vs.index}.fieldName" value="${pt.selectname}" placeholder="必填">
                        <input  type="hidden" name="poll${vs.index}.fieldId" value="${pt.id}" placeholder="必填">
                    </div>

                    <div class="row">
                        <span>问题${va.index+1}选项</span>
                    <c:forEach items="${pt.taidu}" var = "td" varStatus="ss">
                        <input  style="width: 70px;margin: 5px 0" type="text" id = "${ss.index+1}" name="poll${vs.index}.selectName_${ss.index+1}" value="${td.name}">
                    </c:forEach>
                        <button type="button" style="border-radius: 5px" onclick="addele(this)">添加选项</button>
                    </div>
                </div>
                </br>
            </c:forEach>
                <button type="button" onclick="addQuestion(this)">添加问题</button>
                <script>
                    function addele(ths){
                        var ii = $(ths).prev().prop("id")+1;

                        $(ths).before("<input  style='width: 70px;margin: 5px ' type='text' name='selectName_"+ii+"' value=''   placeholder='添加选项'>");
                    }
                    function addQuestion(ths){
                        $(ths).before("<div class='content_group'>"+
                        "<div class='row'>"+
                                "<span>问题标题</span>"+
                                "<input type='text' value='' placeholder='必填'>"+
                                "</div>"+
                                "<div class='row'>"+
                                "<span>问题选项</span>"+
                                "<input style='width: 70px;margin: 5px 0' type='text' value=''>"+
                                "<button type='button' onclick='addele(this)'>添加选项</button></div>"+
                                "</div>"+
                                "</br>");
                    }

                </script>
            </div>
            <div class="row" style="margin: 10px">
                <div class="col-sm-8">
                    <button type="button" style="height: 25px;line-height:15px;width:60px;border-radius: 5px;margin-right: 30px" >保存</button>
                    <button type="button" style="height: 25px;width:60px;line-height:15px;border-radius: 5px;">取消</button>
                </div>

            </div>
        </c:forEach>

    </div>



</form>
</body>




<script>
    function addGroups(){
        $("#boxDiv").clone().appendTo("form")
    }








</script>